{% extends 'base.html' %}
{% load mytags %}
{% block self_head_css_js %}
{% endblock %}
{% block content %}
{% include 'nav_cat_bar.html' %}

<div class="wrapper wrapper-content animated fadeIn">
    <div class="row">
        <div class="col-sm-10">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>文件管理</h5>
                <div class="ibox-tools">
                    <a class="collapse-link">
                        <i class="fa fa-chevron-up"></i>
                    </a>
                    <a class="close-link">
                        <i class="fa fa-times"></i>
                    </a>
                </div>
            </div>
            <div class="ibox-content">
                <div>
                    <form id="groupForm" enctype="multipart/form-data" method="post" class="form-horizontal" action="">
                        {% csrf_token %}
                        {% if error %}
                            <div class="alert alert-warning text-center">{{ error }}</div>
                        {% endif %}
                        {% if msg %}
                            <div class="alert alert-success text-center">{{ msg }}</div>
                        {% endif %}
                        <div class="dropzone-previews">
                            <div class="form-group">
                                <label for="bucket" class="col-sm-2 control-label">上传空间</label>
                                <div class="col-sm-8">
                                    <select class="form-control" id="bucket" name="bucket">
                                        <option value="rrkd-app">rrkd-app</option>
                                        <option value="rrkd">rrkd</option>
                                        <option value="rrkd-video">rrkd-video</option>
                                    </select>
                                </div>
                            </div>

                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label for="upload_file" class="col-sm-2 control-label">上传文件</label>
                                <div class="col-sm-8">
                                    <input type="file" name="upload_file" id="upload_file" placeholder="上传文件" class="form-control" onchange="file_select()" />
                                </div>
                            </div>

                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <label for="upload_name" class="col-sm-2 control-label">保存的文件名</label>
                                <div class="col-sm-8">
                                    <input id="upload_name" name="upload_name" placeholder="" type="text" class="form-control">
                                </div>
                            </div>

                            <div class="hr-line-dashed"></div>
                            <div class="form-group">
                                <div class="col-sm-4 col-sm-offset-2">
                                    <button id="submit_button" class="btn btn-primary" type="submit">确认上传</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    </div>
</div>
{% endblock %}

{% block self_footer_js %}
<script>
    $.ajaxSetup({
    data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
    });

    function file_select(){
        var file = $("#upload_file").val();
        var fileName = getFileName(file);

        function getFileName(o){
            var pos=o.lastIndexOf("\\");
            return o.substring(pos+1);
        }
        $('#upload_name').val(fileName);
    }


</script>

{% endblock %}